<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>

<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!DOCTYPE html>
<html>
<tag:head title="推荐员工" ctx="${ctx}">
</tag:head>
<tag:body>
	<!-- 左 上 导航 -->
	<tag:nav ctx="${ctx}"></tag:nav>
	<!-- page content -->
	<div class="right_col" role="main">
		<div class="">
			<div class="clearfix"></div>

			<div class="row">
				<div class="col-md-12 col-sm-12 col-xs-12">
					<div class="x_panel">
						<div class="x_title">
							<h2>推荐员工</h2>
							<ul class="nav navbar-right panel_toolbox">
								<li>
									<button type="button" class="btn btn-info" onclick="changeRecommendationStaffs()">换一批</button>
								</li>
							</ul>
							<div class="clearfix"></div>
						</div>
						<div class="x_content">
							<div class="col-xs-12">
								<div class="clearfix"></div>
								<div class="clearfix"></div>
								<c:if test="${fn:length(requestScope.staffs) == 0}">
									暂无推荐读友,您在网站的互动太少了，快去借一些书给自己充电吧...
								</c:if>
								<c:forEach items="${requestScope.staffs}" var="staff">
									<div class="col-md-4 col-sm-4 col-xs-12 profile_details">
										<div class="well profile_view">
											<div class="col-sm-12">
												<h4 class="brief"><i>读友信息</i></h4>
												<div class="left col-xs-10">
													<h2>名称:${staff.name}</h2>
													<p><strong>签名: </strong> ${staff.staffSign}</p>
													<ul class="list-unstyled">
														<li><i class="fa fa-envelope"></i>Email: ${staff.email} </li>
														<li><i class="fa fa-qq"></i> qq: ${staff.qq} </li>
													</ul>
												</div>
											</div>
											<div class="col-xs-12 bottom text-center">
												<div class="col-xs-12 col-sm-6 emphasis">
													<p class="ratings">
														<c:forEach begin="1" end="${staff.grade}">
															<i class="fa fa-star"></i>
														</c:forEach>
															${staff.grade}级
													</p>
												</div>
												<div class="col-xs-12 col-sm-6 emphasis">
													<button id="${staff.staffId}" class="btn btn-sm btn-default follow" onclick="followFriend(this,${staff.staffId})" type="button">关注他</button>
													<button type="button" class="btn btn-primary btn-xs" onclick="friendHistory('${staff.staffId}')">
														<i class="fa fa-book"> </i> 他看过的书
													</button>
													<button type="button" class="btn btn-primary btn-xs" onclick="friendData('${staff.staffId}')">
														<i class="fa fa-book"> </i> 他的数据
													</button>
												</div>
											</div>
										</div>
									</div>
								</c:forEach>
							</div>
							<div class="clearfix"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- page content -->

	<!-- footer content -->
	<tag:footer></tag:footer>
</tag:body>
<!-- javascript -->
<tag:javascript ctx="${ctx}">
	<!-- this page-->
	<script src="${ctx}/assets/js/staff/staff_recommend_staff/staff_recommend_staff.js"></script>
	<script>
		function checkStaffFollowersExists(staffId) {
			<c:forEach var="staff" items="${requestScope.circles.followStaffs}">
				if(staffId == ${staff.staffId})
					return true;
			</c:forEach>
		}
	</script>
</tag:javascript>
</html>

